<!doctype html>
<html lang="en" ng-app="myApp">
    <head>
        <meta charset="utf-8">
        <title>AngularJS Zend2 Sample APP</title>
        <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
        <link rel="stylesheet" href="css/app.css"/>
    </head>
    <body ng-controller="AppCtrl">
        <div class="navbar">
            <div class="navbar-inner">
                <div class="container-fluid">
                    <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </a>

                    <a class="brand" href="#">
                        <msg key="title"></msg>
                    </a>
                    <div class="nav-collapse collapse">
                        <ul class="nav">
                            <li ng-class="activeWhen(path() == '/albums')">
                                <a href="#/albums">Albums</a>
                            </li>
                            <li ng-class="activeWhen(path() == '/new')" ng-show="user.username">
                                <a href="#/new">New Album</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div class="container-fluid">
            <div ng-class="'alert alert-' + message().type" ng-show="message().show">
                <button type="button" class="close" ng-click="message().show = false">&times;</button>
                <msg key-expr="message().text"></msg>
            </div>
            <ng-view></ng-view>
            <div class="footer">
                <div class="row-fluid">Angular seed app: v<span app-version></span></div>
                <div class="row-fluid">
                    <ul class="nav nav-pills">
                        <li ng-class="activeWhen(language() == 'zh_CN')">
                            <a ng-click="setLanguage('zh_CN')">简体中文</a>
                        </li>
                        <li ng-class="activeWhen(language() == 'en')">
                            <a ng-click="setLanguage('en')">English</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>


        <!-- In production use:
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
        -->
        <script type="text/javascript" src="lib/jquery.js"></script>
        <script type="text/javascript" src="lib/jquery.i18n.properties-min-1.0.9.js"></script>
        <script type="text/javascript" src="lib/html5shiv.js"></script>
        <script type="text/javascript" src="lib/holder.js"></script>
        <script type="text/javascript" src="lib/bootstrap/js/bootstrap.min.js"></script>

        <script type="text/javascript" src="lib/angular/angular.js"></script>  
        <script type="text/javascript" src="js/app.js"></script>
        <script type="text/javascript" src="js/services.js"></script>
        <script type="text/javascript" src="js/controllers.js"></script>
        <script type="text/javascript" src="js/filters.js"></script>
        <script type="text/javascript" src="js/directives.js"></script>

    </body>
</html>
